<template>
  <div class="aotoBox">
    <van-nav-bar title="维修单详情" fixed class="titleStyle" left-arrow @click-left="onClickLeft" />
    <div class="publicBox">
      <div class="myDetailTopBox">
        <div class="myDetailTopBoxCont">
          <h1>
            <span>维修申请单：{{ detailInfo.applyNo }}</span>
          </h1>
          <ul class="detailsUl">
            <li>
              <div>
                <span>设备名称：</span>
                <b>{{ detailInfo.equipName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>设备编码：</span>
                <b>{{ detailInfo.equipCode }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>故障分类：</span>
                <b>{{ detailInfo.faultClassifyName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>故障发生时间：</span>
                <b>{{ detailInfo.faultTime }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>申请人：</span>
                <b>{{ detailInfo.applyName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>紧急度：</span>
                <b>{{ detailInfo.emergency }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>所属部门：</span>
                <b>{{ detailInfo.factoryName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>维修方式：</span>
                <b>{{ detailInfo.repairMethod > 0 ? detailInfo.repairMethod === 1 ? '内修':'外修' :'' }}</b>
              </div>
            </li>
            <li style="width:100%;">
              <div>
                <span>故障描述：</span>
                <b>{{ detailInfo.faultRemark }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>确认人：</span>
                <b>{{ detailInfo.confirmName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>确认时间：</span>
                <b>{{ detailInfo.confirmTime }}</b>
              </div>
            </li>
            <li style="width:100%;">
              <div>
                <span>外修理由：</span>
                <b>{{ detailInfo.repairOutReason }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>制单人：</span>
                <b>{{ detailInfo.makeUserName }}</b>
              </div>
            </li>
            <li>
              <div>
                <span>制单时间：</span>
                <b>{{ detailInfo.makeTime }}</b>
              </div>
            </li>
          </ul>
        </div>
        <p class="pStyle">自定义字段</p>
        <div class="extensionDiv">
          <van-field v-for="(item, index)  in extension" disabled :key="index" v-model="item.value" :name="item.value" :label="item.fieldName" />
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'RepairDetail',
  data() {
    return {
      detailInfo: {},
      extension: [],
      pjTableData: [],
      tableName: 't_equip_repair_order' // 自定义字段所属表名
    }
  },
  computed: {},
  watch: {},
  mounted() {
    this.getDatas()
  },
  methods: {
    async getDatas() {
      this.getFields()
      this.getReplaceList(this.$route.query.id)
      this.loading = true
      const res = await this.$axios.get(
        `/dobo-equip/repair/order/detail?id=${this.$route.query.id}`
      )
      if (res.data.code === 200) {
        this.detailInfo = res.data.data
        if (this.extension.length > 0) {
          this.extension.forEach((el) => {
            for (const key in this.detailInfo.extensionInfo) {
              if (
                Object.hasOwnProperty.call(this.detailInfo.extensionInfo, key)
              ) {
                const item = this.detailInfo.extensionInfo[key]
                if (el.fieldColumn === key) {
                  el.value = item
                }
              }
            }
          })
        }
      }
    },
    /* 配件更换清单数据 */
    async getReplaceList(id) {
      const res = await this.$axios.get(
        `/dobo-product/equip/sp/pick/getReplaceList?id=${id}`
      )
      if (res.data.code === 200) {
        this.pjTableData = res.data.data
      }
    },
    /* 获取自定义字段 */
    async getFields() {
      // 如有有值传过来  那么是编辑操作
      const res = await this.$axios.get(
        `/dobo-platform/general/field/extension/${this.tableName}`
      )
      if (res && res.data.code === 200) {
        this.extension = res.data.data
      }
    },
    // 返回
    onClickLeft() {
      this.$router.push('./eqRepairRequest')
    }
  }
}
</script>

<style lang='scss' scoped>
.pStyle {
  height: 35px;
  line-height: 35px;
  background: #f5f5f5;
  text-align: center;
}
.extensionDiv {
  overflow: hidden;
  .van-field {
    width: 50%;
    float: left;
    border: 1px solid #f5f5f5;
  }
}
h1 {
  height: 40px;
  line-height: 40px;
  font-weight: normal;
  text-align: center;
  background: #eeee;
}
</style>

